<template>
  <Drawer v-model:visible="visible" :destroyOnClose="true" class="custom-class" placement="right" title="治理策略详情"
          width="40%">
    <Divider>基本信息</Divider>
    <div class="md:my-15">
      <DetailsBasic v-bind="detailsProps" @change="changeHandler"/>
    </div>

    <Divider>策略信息</Divider>

    <div v-if="governType === '1'" class="md:my-15">
      <DetailsRetry v-bind="detailsProps"/>
    </div>
    <div v-if="governType === '2'" class="md:my-15">
      <DetailsRateLimit v-bind="detailsProps"/>
    </div>
    <div v-if="governType === '3'" class="md:my-15">
      <DetailsBulkhead v-bind="detailsProps"/>
    </div>
    <div v-if="governType === '4'" class="md:my-15">
      <DetailsCircuitBreaker v-bind="detailsProps"/>
    </div>
    <div class="absolute bottom-10 right-8">
      <Button style="margin-right: 8px; font-weight: bolder" @click="onClose">关闭</Button>
    </div>
  </Drawer>
</template>
<script lang="ts" setup>
import {Button, Divider, Drawer} from 'ant-design-vue';
import {viewGovernance} from '/@/api/maintenance-center/microservice-govern/governance/governance';
import {ref} from 'vue';
import {GovernanceDetailItem} from '/@/api/maintenance-center/microservice-govern/governance/model/governanceModel';
import DetailsBasic from '/@/views/maintenance-center/microservice-govern/components/details/detailsBasic.vue';
import DetailsRateLimit from '/@/views/maintenance-center/microservice-govern/components/details/detailsRateLimit.vue';
import DetailsRetry from '/@/views/maintenance-center/microservice-govern/components/details/detailsRetry.vue';
import DetailsBulkhead from '/@/views/maintenance-center/microservice-govern/components/details/detailsBulkhead.vue';
import DetailsCircuitBreaker
  from '/@/views/maintenance-center/microservice-govern/components/details/detailsCircuitBreaker.vue';

const visible = ref<boolean>(false);
const governType = ref('0');
const details = ref();
const detailsProps = ref({
  id: '',
  strategyMethod: '',
  strategyName: '',
  scenarioId: '',

  rate: '',
  limitRefreshPeriod: '',
  rlTimeUnit: '',

  retryOnResponseStatus: '',
  maxAttempts: '',
  retryStrategy: '',
  initialInterval: '',
  waitDuration: '',
  multiplier: '',
  rtTimeUnit: '',

  maxConcurrentCalls: '',
  maxWaitDuration: '',
  bhTimeUnit: '',

  slidingWindowType: '',
  slidingWindowSize: '',
  windowSizeUnit: '',
  minimumNumberOfCalls: '',
  failureRateThreshold: '',
  slowCallDurationThreshold: '',
  slowCallTimeUnit: '',
  slowCallRateThreshold: '',
});

function changeHandler(record: string) {
  if (record === 'retry') {
    governType.value = '1';
  } else if (record === 'rateLimiting') {
    governType.value = '2';
  } else if (record === 'bulkhead') {
    governType.value = '3';
  } else if (record === 'circuitBreaker') {
    governType.value = '4';
  }
}

async function setFormData(fieldsValue: GovernanceDetailItem) {
  detailsProps.value.id = fieldsValue.id;
  detailsProps.value.strategyMethod = fieldsValue.strategyMethod;
  detailsProps.value.strategyName = fieldsValue.strategyName;
  detailsProps.value.scenarioId = fieldsValue.scenarioId;

  await changeHandler(fieldsValue.strategyMethod);
  if (governType.value === '1') {
    detailsProps.value.retryOnResponseStatus = fieldsValue.retryParams.retryOnResponseStatus;
    detailsProps.value.maxAttempts = fieldsValue.retryParams.maxAttempts;
    if (fieldsValue.retryParams.retryStrategy === 'FixedInterval') {
      detailsProps.value.retryStrategy = '固定时间间隔';
    } else {
      detailsProps.value.retryStrategy = '指数时间间隔';
    }
    detailsProps.value.initialInterval = fieldsValue.retryParams.initialInterval;
    detailsProps.value.waitDuration = fieldsValue.retryParams.waitDuration;
    detailsProps.value.rtTimeUnit = fieldsValue.retryParams.rtTimeUnit;
    detailsProps.value.multiplier = fieldsValue.retryParams.multiplier;
  } else if (governType.value === '2') {
    detailsProps.value.rate = fieldsValue.rateLimitingParams.rate;
    detailsProps.value.limitRefreshPeriod = fieldsValue.rateLimitingParams.limitRefreshPeriod;
    detailsProps.value.rlTimeUnit = fieldsValue.rateLimitingParams.rlTimeUnit;
  } else if (governType.value === '3') {
    detailsProps.value.maxConcurrentCalls = fieldsValue.bulkheadParams.maxConcurrentCalls;
    detailsProps.value.maxWaitDuration = fieldsValue.bulkheadParams.maxWaitDuration;
    detailsProps.value.bhTimeUnit = fieldsValue.bulkheadParams.bhTimeUnit;
  } else if (governType.value === '4') {
    detailsProps.value.slidingWindowType = fieldsValue.circuitBreakerParams.slidingWindowType;
    detailsProps.value.slidingWindowSize = fieldsValue.circuitBreakerParams.slidingWindowSize;
    detailsProps.value.windowSizeUnit = fieldsValue.circuitBreakerParams.windowSizeUnit;
    detailsProps.value.minimumNumberOfCalls = fieldsValue.circuitBreakerParams.minimumNumberOfCalls;
    detailsProps.value.failureRateThreshold = fieldsValue.circuitBreakerParams.failureRateThreshold;
    detailsProps.value.slowCallDurationThreshold = fieldsValue.circuitBreakerParams.slowCallDurationThreshold;
    detailsProps.value.slowCallTimeUnit = fieldsValue.circuitBreakerParams.slowCallTimeUnit;
    detailsProps.value.slowCallRateThreshold = fieldsValue.circuitBreakerParams.slowCallRateThreshold;
  }
}

const showDrawer = async (params?: Recordable) => {
  governType.value = '0';
  visible.value = true;
  details.value = await viewGovernance({strategyId: params.id});
  await setFormData(details.value);
};

const onClose = async () => {
  visible.value = false;
};
defineExpose({showDrawer});
</script>
